﻿<Page
    x:Class="Telerik.RadCartesianChartSample.MainPage"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    xmlns:chart="using:Telerik.UI.Xaml.Controls.Chart"
    mc:Ignorable="d">

    <Grid Background="White">
        <Grid.Resources>
            <SolidColorBrush Color="DarkOrange"  x:Key="ChartColorKey"/>
        </Grid.Resources>
        <Grid.RowDefinitions>
            <RowDefinition Height="140"/>
            <RowDefinition Height="*"/>
            <RowDefinition Height="40"/>
        </Grid.RowDefinitions>
        <Grid.ColumnDefinitions>
            <ColumnDefinition Width="120" />
            <ColumnDefinition Width="*" />
            <ColumnDefinition Width="120" />
        </Grid.ColumnDefinitions>
        <TextBlock Text="Telerik RadCartesianChart Sample" Margin="0" Grid.Column="1" Grid.Row="0" Style="{StaticResource PageHeaderTextStyle}" Foreground="{StaticResource ChartColorKey}"/>
        <chart:RadCartesianChart PaletteName="DefaultDark" Grid.Column="1" Grid.Row="1" Margin="0,20,0,0">
            <chart:RadCartesianChart.Grid>
                <chart:CartesianChartGrid MajorLinesVisibility="Y">
                    <chart:CartesianChartGrid.MajorYLineStyle>
                        <Style TargetType="Line">
                            <Setter Property="Stroke" Value="{StaticResource ChartColorKey}" />
                            <Setter Property="StrokeDashArray" Value="4, 2" />
                        </Style>
                    </chart:CartesianChartGrid.MajorYLineStyle>
                </chart:CartesianChartGrid>
            </chart:RadCartesianChart.Grid>
            <chart:RadCartesianChart.VerticalAxis>
                <chart:LinearAxis Title="Number of flowers" FontSize="18" MajorStep="{Binding MajorStep}">
                    <chart:LinearAxis.TitleTemplate>
                        <DataTemplate>
                            <TextBlock Text="{Binding}" FontSize="18" Foreground="Black" Margin="0,0,0,20"/>
                        </DataTemplate>
                    </chart:LinearAxis.TitleTemplate>
                    <chart:LinearAxis.LineStyle>
                        <Style TargetType="Line">
                            <Setter Property="Stroke"  Value="{StaticResource ChartColorKey}" />
                        </Style>
                    </chart:LinearAxis.LineStyle>
                    <chart:LinearAxis.LabelStyle>
                        <Style TargetType="TextBlock">
                            <Setter Property="Foreground"  Value="{StaticResource ChartColorKey}" />
                            <Setter Property="FontSize" Value="14"></Setter>
                        </Style>
                    </chart:LinearAxis.LabelStyle>
                    <chart:LinearAxis.MajorTickStyle>
                        <Style TargetType="Rectangle">
                            <Setter Property="Stroke"  Value="{StaticResource ChartColorKey}" />
                        </Style>
                    </chart:LinearAxis.MajorTickStyle>
                </chart:LinearAxis>
            </chart:RadCartesianChart.VerticalAxis>
            <chart:RadCartesianChart.HorizontalAxis>
                <chart:CategoricalAxis Title="Flowers" FontSize="18">
                    <chart:CategoricalAxis.TitleTemplate>
                        <DataTemplate>
                            <TextBlock Text="{Binding}" FontSize="18" Foreground="Black" />
                        </DataTemplate>
                    </chart:CategoricalAxis.TitleTemplate>
                    <chart:CategoricalAxis.LineStyle>
                        <Style TargetType="Line">
                            <Setter Property="Stroke"  Value="{StaticResource ChartColorKey}" />
                        </Style>
                    </chart:CategoricalAxis.LineStyle>
                    <chart:CategoricalAxis.LabelStyle>
                        <Style TargetType="TextBlock">
                            <Setter Property="Foreground" Value="{StaticResource ChartColorKey}" />
                            <Setter Property="FontSize" Value="14"></Setter>
                        </Style>
                    </chart:CategoricalAxis.LabelStyle>
                    <chart:CategoricalAxis.MajorTickStyle>
                        <Style TargetType="Rectangle">
                            <Setter Property="Stroke"  Value="{StaticResource ChartColorKey}"  />
                        </Style>
                    </chart:CategoricalAxis.MajorTickStyle>
                </chart:CategoricalAxis>
            </chart:RadCartesianChart.HorizontalAxis>
            <chart:BarSeries ItemsSource="{Binding DashBoardItems}">
                <chart:BarSeries.PointTemplates>
                    <DataTemplate>
                        <Rectangle  Fill="LightBlue"/>
                    </DataTemplate>
                    <DataTemplate>
                        <Rectangle   Fill="Pink"/>
                    </DataTemplate>
                    <DataTemplate>
                        <Rectangle  Fill="Yellow"/>
                    </DataTemplate>
                </chart:BarSeries.PointTemplates>
                <chart:BarSeries.CategoryBinding>
                    <chart:PropertyNameDataPointBinding PropertyName="Name"  />
                </chart:BarSeries.CategoryBinding>
                <chart:BarSeries.ValueBinding>
                    <chart:PropertyNameDataPointBinding PropertyName="Count" />
                </chart:BarSeries.ValueBinding>
            </chart:BarSeries>
        </chart:RadCartesianChart>

        <chart:RadCartesianChart PaletteName="DefaultDark">
        </chart:RadCartesianChart>
    </Grid>
</Page>
